import React, { Component, Suspense } from 'react';
import { connect } from 'dva';
import { Row, Col, Input, Button, Table, Card, message, Icon, Pagination,Modal } from 'antd';
import  http from '@/utils/http';
const { confirm } = Modal;

@connect(({ notice, loading }) => ({
  notice,
  loading: loading.effects['notice/getNotice'],
}))

class Notice extends Component {
  constructor(props) {
    super(props);
    this.state = {
      page: 1,
      notices:[],
      tableLoading:true,
      total:0,
      limit:10,
      isCoverSlot:false,
      isCoverDict:false,
      isCoverApi:false,
      isCoverQa:false,
      noticeId:null
    };
    this.columns = [
      {
        key: 'title',
        align: 'left',
        title: '标题',
        dataIndex: 'title',
        width: 300,
      },
      {
        key: 'content',
        align: 'left',
        title: '通知内容',
        dataIndex: 'content',
      },
      {
        key: 'time',
        align: 'left',
        title: '通知时间',
        dataIndex: 'time',
        width: 200,
      },
      {
        title: '操作',
        align: 'left',
        render: (text, row) => {
          return <div>
            {!row.noticeType=='shareQA'
              ?
              <div>
                <Button type="danger" icon="delete" htmlType='button' size='small' style={{marginRight:5}} onClick={() => this.delNotice(row)}>
                  删除
                </Button>
              </div>
              :
              <div>
                <Button type="danger" icon="delete" htmlType='button' size='small' style={{marginRight:5}} onClick={() => this.delNotice(row)}>
                  删除
                </Button>
                {
                  row.operation===null?<span>
                     <Button type="primary"  icon="check" htmlType='button' size='small' style={{marginRight:5}} onClick={() => this.dealShareNotice(row,true)}>
                      接受
                    </Button>
                    <Button htmlType='button' icon="close"  size='small' style={{marginRight:5}} onClick={() => this.dealShareNotice(row,false)}>
                     拒绝
                    </Button>
                    </span>:
                  row.operation==='accept'?<Button type="primary" disabled icon="check" htmlType='button' size='small' style={{marginRight:5}} >
                  已接受
                  </Button>:
                  <Button htmlType='button' icon="close" disabled size='small' style={{marginRight:5}} >
                  已拒绝
                  </Button>
                }
              </div>
            }
          </div>;
        },
        width: '300px',
      },
    ];
  }

  componentDidMount() {
   this.getNotice()
  }

  onChangeForPage=(number)=>{
    this.setState({
      page:number
    },()=>{
      this.getNotice();
    })
  };

  onShowSizeChangeForPage=(current,size)=>{
    this.setState({
      limit:size,
      page:current
    },()=>{
      this.getNotice();
    })
  };

  getNotice=()=>{
    const { dispatch ,currentUser} = this.props;
    // dispatch({
    //   type: 'notice/getNotice',
    //   payload: {page:this.state.page,limit:this.state.limit},
    //   callback:(res)=>{
    //     this.setState({
    //       notices: res.items,
    //       total:res.total,
    //       tableLoading: false
    //     })
    //   }
    // });

    this.noticeJson({page:this.state.page,limit:this.state.limit}).then((res) =>{
      // success
      this.setState({
        notices: res.items,
        total: res.total,
        tableLoading: false,
      });
    }, (error)=> {
      // failure
      console.log(error)
    });
  };

  dealShareNotice=(row)=>{
    this.setState({
      noticeId:row._id
    },()=>{
      this.acceptShare(row._id)
    })
  };

  acceptShare =(id)=>{
    const {isCoverSlot,isCoverDict,isCoverApi,isCoverQa} = this.state;
    const {currentUser} = this.props;
    this.newDealShareNoticeJson({id,robotId:currentUser.robotId,isCoverSlot,isCoverDict,isCoverApi,isCoverQa}).then((res)=>{
      console.log(res,'--------接受分享知识点的结果')
      if(res.code == 0){
        message.info(res.msg);
       this.getNotice();
      }else if(res.code == 5000){
        this.showConfirm(res.data.msg,res.data.type)
      }
    },(err)=>{
      console.log(err)
    })
  };

  delNotice=(row,type)=>{
    const { dispatch} = this.props;
    // dispatch({
    //     type: 'notice/delectNotice',
    //     payload: {id:row._id},
    //     callback:(res)=>{
    //       this.getNotice();
    //     }
    //   });
    this.deleteNotice({id:row._id}).then((res)=>{
      this.getNotice();
    },(err)=>{
      console.log(err)
    })
  };

  /* 获取通知列表 */
  noticeJson=(params)=> {
    return http.post('/cloud/noticeJson',params);
  };

  /* 接受拒绝共享知识点 */
  dealShareNoticeJson=(params)=> {
    return http.post('/cloud/share/shared-category/dealShareNoticeJson',params);
  };

  newDealShareNoticeJson=(params)=> {
    return http.postWithData('/cloud/new/system/notice/accept',params);
  };

  // 删除通知
  deleteNotice =(params) => {
    return http.post('/cloud/new/system/notice/delete', params);
  };

  showConfirm = (msg,val) => {
    const that = this;
    let {isCoverSlot,isCoverQa,isCoverApi,isCoverDict,noticeId} = that.state;
    confirm({
      title: msg,
      content: '',
      onOk() {
        console.log('OK');
        if(val === 'slot'){
          isCoverSlot = true
        }
        if(val === 'api'){
          isCoverApi = true
        }
        if(val === 'dict'){
          isCoverDict = true
        }
        if(val === 'qa'){
          isCoverQa = true
        }
        that.setState({
          isCoverSlot,isCoverQa,isCoverApi,isCoverDict
       },()=>{
         console.log(that.state);
         that.acceptShare(noticeId);
        })
      },
      onCancel() {
        console.log('Cancel');
      },
    });
  };




  render() {
    const {notices,tableLoading,page,total,pageSize} = this.state;
    return (
      <div>
        <Table
          columns={this.columns}
          dataSource={notices}
          rowKey="_id"
          pagination={false}
          // pagination={{  // 分页
          //   total: total,
          //   pageSize: pageSize,  // 显示几条一页
          //   defaultPageSize: page, // 当前页
          //   showSizeChanger: true,  // 是否显示可以设置几条一页的选项
          //   showQuickJumper: true,
          //   onChange: this.onChangeForPage,
          //   onShowSizeChange: this.onShowSizeChangeForPage
          // }}
          loading={tableLoading}
        />
        <Pagination
          style={{ textAlign: 'center', marginTop: 30, marginBottom: 20 }}
          showSizeChanger
          total={parseInt(this.state.total)}
          current={this.state.pageSize}
          onChange={this.onChangeForPage}
          onShowSizeChange={(current, pageSize) => this.onShowSizeChangeForPage(current, pageSize)}
          showTotal={() => `共 ${this.state.total} 条`}
        />
      </div>

    );
  }
}

export default connect (({ user }) => ({
  currentUser: user.currentUser
}))(Notice);
